﻿

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>上班时间设置</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
    <link href="../../../layuiadmin/style/mystyle.css" rel="stylesheet" />
    <script src="../../../layuiadmin/lib/api.js"></script>
    <script src="../../../layuiadmin/lib/common.js"></script>
    <script src="../../../layuiadmin/lib/jquery.min.js"></script>
    <script src="../../../layuiadmin/layui/layui.js"></script>
</head>
<body>

    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">上班时间设置</div>
                    <div class="layui-card-body" pad15>
                        <div class="layui-form" wid100 lay-filter="">
                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width:160px;">上午上班开始时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" readonly class="layui-input" name="morning_start" id="morning_start" lay-verify="required" placeholder="开始时间">
                                </div>

                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width:160px;">上午上班结束时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" readonly class="layui-input" name="morning_end" id="morning_end" lay-verify="required" placeholder="结束时间">
                                </div>

                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width:160px;">下午上班开始时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" readonly class="layui-input" name="afternoon_start" id="afternoon_start" lay-verify="required" placeholder="开始时间">
                                </div>

                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width:160px;">下午上班结束时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" readonly class="layui-input" name="afternoon_end" id="afternoon_end" lay-verify="required" placeholder="结束时间">
                                </div>

                            </div>
                            <div class="layui-form-item" style="display:none;">
                                <label class="layui-form-label" style="width:160px;">工作总时间</label>
                                <div class="layui-input-inline">
                                    <input type="text" readonly class="layui-input" name="total" id="total" lay-verify="required" placeholder="0">
                                </div>

                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label" style="width:160px;"></label>
                                <div class="layui-input-inline">
                                    <button class="layui-btn" lay-submit lay-filter="save" id="save">保存</button>
                                </div>

                            </div>
                        </div>                       
                    </div>
                </div>
            </div>
        </div>
    </div>

    
    <script>
        layui.config({
            base: '../../../layuiadmin/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'set', 'laydate'], function () {
            var $ = layui.$
                , form = layui.form;

            //监听提交
            form.on('submit(save)', function (data) {
                var field = data.field; //获取提交的字段
                var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                
                //提交 Ajax 成功后，关闭当前弹层并重载表格
                $.ajax({
                    url: "/SetTimeMerber/UpdateWorkTimeJson",    //请求的url地址
                    dataType: "json",   //返回格式为json
                    async: true,//请求是否异步，默认为异步，这也是ajax重要特性
                    data: { json: JSON.stringify(field) },    //参数值
                    type: "POST",   //请求方式
                    
                    success: function (data) {
                        //请求成功时处理 
                        layer.msg(data.message);
                    },
                    error: function (res) {
                        console.log(res);
                        layer.msg("修改失败，请联系技术人员");
                    }
                });

            });


            var laydate = layui.laydate;
            //上午上班开始日期
            var insStart = laydate.render({
                elem: '#morning_start'
                , format: 'HH:mm'
                , type: 'time'
            });
            //上午上班结束时间
            laydate.render({
                elem: '#morning_end'
                , format: 'HH:mm'
                , type: 'time'
            });
            //下午开始上班时间
            laydate.render({
                elem: '#afternoon_start'
                , format: 'HH:mm'
                , type: 'time'
            });
            //下午上班结束时间
            laydate.render({
                elem: '#afternoon_end'
                , format: 'HH:mm'
                , type: 'time'
            });

        });
        //获取后台数据
        $.ajax({
            url: "/SetTimeMerber/GetWorkTimeJson",    //请求的url地址
            dataType: "json",   //返回格式为json
            //async: true,//请求是否异步，默认为异步，这也是ajax重要特性
            data: {},    //参数值
            type: "POST",   //请求方式
            success: function (data) {
                for (let key in data) {
                    $("#" + key).val(data[key]);
                    
                }
            },
            error: function (res) {
                layer.msg("接口异常，请联系技术人员");
            }
        });

        
    </script>
</body>
</html>